import React from 'react';
import logo from './logo.svg';
import './App.css';
import { postLogin, getDelete } from './api/index'


class App extends React.Component {
  
  state = {
    username: '',
    password: ''
  }

  render() {
    const { username, password } = this.state;
    return <div>
     账号： <input value={username}  onChange={(e) => {
       this.handleUser(e)
     }} /> 
     密码： <input value={password} onChange={(e) => {
       this.handlePwd(e)
      }
     } />
     <hr />
      <button onClick={() => this.handleBtnClick() } >登陆</button>
    
    <hr></hr>

    <button onClick={this.handleDelete}>删除事件</button>


    </div>
  }

  handleDelete = () => {
    console.log('delete')
    // 根据id删除
    getDelete({id: 1}).then(res => {
      console.log(res, 'res')
    })
  }

  handleBtnClick = () => {
    console.log(1)
    const obj = {
      username: this.state.username,
      password: this.state.password
    }
    postLogin({...obj}).then(res => {
      console.log(res, 'res')
      sessionStorage.setItem('token', res.data.token)
    })
  }

  handleUser = (e) => {
    const val = e.target.value
    console.log(val, 'val---use')
    this.setState({
      username: val
    })
  }

  handlePwd = (e) => {
    const val = e.target.value
    console.log(val, 'val---wpd')
    this.setState({
      password: val
    })
  }
  
  componentDidMount() {

  }
}


export default App;
